// breakpoints - xs < 576px | sm 576px > < 768px | md 768px > < 992| lg 992 > < 1200px | xl 1200px > < 1600 | xxl > 1600px
$screen-sm: 576px;
$screen-md: 768px;
$screen-lg: 992px;
$screen-xl: 1200px;
$screen-xxl: 1600px;

// Media queries
$mobile: 'only screen and (max-width: #{$screen-sm - 1})';
$tablet: 'only screen and (min-width: #{$screen-sm}) and (max-width: #{$screen-md - 1})';
$desktop: 'only screen and (min-width: #{$screen-md})';
$small-desktop: 'only screen and (min-width: #{$screen-md})' and
  (
    max-width: #{$screen-xl - 1},
  );
$medium-desktop: 'only screen and (min-width: #{$screen-xl})' and
  (
    max-width: #{$screen-xxl - 1},
  );
$tablet-desktop: 'only screen and (min-width: #{$screen-sm})';
$mobile-tablet: 'only screen and (max-width: #{$screen-md - 1})';

// mobile landscape
$mobile-landscape: 'only screen and (max-height: #{$screen-sm - 1})';
